﻿@page "/settings/about"
@inject IJSRuntime JS

<MAppBar App>
    <NavLink @onclick="Back">
        <MButton icon>
            <MIcon>mdi-arrow-left</MIcon>
        </MButton>
    </NavLink>
    <MToolbarTitle>关于ToDoList</MToolbarTitle>

</MAppBar>
<MMain>
    <h3>About 这是一个关于页</h3>
    <h3>@(Text)</h3>
    <MButton @onclick="UpdateValueAsync">更新Text</MButton>
</MMain>

@code {
    public string Text { get; set; } = "text:";
    private DotNetObjectReference<About> _selfRef;// 传递给JS的页面实例对象
    private bool isInitJs = false;
    protected override async Task OnInitializedAsync()
    {
        if (_selfRef == null)
            _selfRef = DotNetObjectReference.Create(this);
    }
    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (!isInitJs)
        {
            isInitJs = true;
            await JS.InvokeVoidAsync("window.setPageInstance", _selfRef);
        }
    }

    protected override Task OnParametersSetAsync()
    {
        return base.OnParametersSetAsync();
    }
    

    /// <summary>
    /// JSInvokable标记可以让JS调用的方法
    /// </summary>
    /// <param name="text"></param>
    /// <returns></returns>
    [JSInvokable]
    public async Task SetRandomValueAsync(string text)
    {
        Text = "text:"+ text;
    }
    public async Task UpdateValueAsync()
    {
        await JS.InvokeVoidAsync("window.getRandomId", _selfRef,
        "background value:"+ new Random().Next());
    }
    private async Task Back()
    {
        await JS.InvokeVoidAsync("window.history.back");
    }
}
